import React, { useState } from 'react';
import { Modal } from 'antd';
import ProTable from '@ant-design/pro-table';
import { getOperateLog } from '@/services/public';
import FileOpen from '@/components/FileIframOpen';

let isFirst = true;
const ActionLog: React.FC<any> = ({ visible, cancel, info, targetType, clientType, targetId }) => {
  const [operateData, setOperateData] = useState<any>({});
  const [fileUrl, setFileUrl] = useState('');
  const [fileVisible, setFileVisible] = useState(false);

  const listRequest = async (params: any) => {
    const response = await getOperateLog({ targetId, targetType, clientType });
    if (isFirst && response.success) {
      setOperateData(
        response.data && response.data[0] ? JSON.parse(response.data[0].operate) : null,
      );
    }
    isFirst = false;
    return response;
  };

  const columns: any = [];
  if (operateData) {
    Object.keys(operateData).map((item: any) => {
      console.log(item, 'item');
      if (item == '调查询问通知书' || item == '改正指令书文件' || item == '附件') {
        columns.push({
          title: item,
          dataIndex: item,
          width: 200,
          render: (_: any, record: any) => {
            const operate = record.operate ? JSON.parse(record.operate) : {};
            if (operate[item] == '-') {
              return (
                <span>{operate[item]}</span>
              )
            }
            return (
              <a
                onClick={() => {
                  setFileUrl(operate[item]);
                  setFileVisible(true);
                }}
              >
                查看
              </a>
            )
          },
        });
        return
      }

      columns.push({
        title: item,
        dataIndex: item,
        width: 200,
        render: (_: any, record: any) => {
          const operate = record.operate ? JSON.parse(record.operate) : {};
          return <span>{operate[item]}</span>;
        },
      });
    });
  }

  return (
    <Modal
      title="处理明细"
      onCancel={() => {
        isFirst = true;
        cancel();
      }}
      visible={visible}
      footer={null}
      width={'1000px'}
      destroyOnClose
    >
      {operateData ? (
        <ProTable
          headerTitle={info.projectName || ''}
          rowKey="id"
          request={(params) => listRequest(params)}
          columns={columns}
          rowSelection={false}
          options={false}
          search={false}
          pagination={false}
        />

      ) : (
        <span style={{ display: 'inline-block', textAlign: 'center', width: '100%' }}>
          暂无数据
        </span>
      )}
      {fileVisible && (
        <FileOpen
          title={''}
          fielUrl={fileUrl}
          modalVisible={fileVisible}
          onCancel={() => {
            setFileVisible(false);
            setFileUrl('');
          }}
        />
      )}
    </Modal>
  );
};

export default ActionLog;
